<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>办件进度查询列表</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no,viewport-fit=cover">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<link rel="stylesheet" href="../../css/mui.min.css">
		<link rel="stylesheet" href="../../css/app.css">
		<style type="text/css">
			/*#list {margin-top: -1px;}*/
			*{margin: 0;padding: 0;}
			html,body{width: 100%;height: 100%;background: #ffffff}
			ul,li{list-style: none;}
			.mui-content{width: 100%!important;height: 100%;background: #f3f3f3;overflow: auto;}
			.mui-content::-webkit-scrollbar { display: none;}
			.mui-content ul{width: 100%;} 
			.mui-content ul li{width: 100%;height: 1.3rem;background: #fff;margin-bottom: 0.16rem solid #ccc;position: relative;}
			.mui-content ul li .title{height: 0.8rem;font-size: 0.32rem;line-height: 0.48rem;position: absolute;top: 0.26rem;left: 0.225rem;width:6.5rem;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
			.mui-content ul li img{width: 0.18rem;position: absolute;top:0.52rem;right: 0.33rem;}
			.mui-content ul li .time{width:3.885rem ;font-size:0.24rem;color:#9b9b9b;position: absolute;bottom: 0.28rem;left: 0.225rem;height:0.24rem;}
			.mui-content ul li .time span:first-child{margin-right: 0.5rem;}
			.mui-table-view:before,.mui-table-view:after{content: none;}
			.mui-content>.mui-table-view:first-child{margin-top: 0;}
			.mui-pull-bottom-pocket, .mui-pull-top-pocket{visibility: visible;}
		</style>
	</head>
	<body>
		<div id="scroll" class="mui-content mui-scroll-wrapper">
			<div class="mui-scroll">
				<ul class="mui-table-view mui-table-view-chevron">
					<li :caseNum='zwfwCase.caseNum' class="mui-table-view-cell" v-for="zwfwCase in bjcxList">
						<div class="title">{{zwfwCase.serviceName}}</div>
						<img src="../../images/yuyue/arr.png"/>
						<div class="time">
							<span>{{zwfwCase.applyTime}}</span>
						</div>
					</li>
				</ul>
			</div>
		</div>
	</body>
	<script>
		function my_immersed(){
			
		}
	</script>
	<script src="../../js/immersed.js"></script>
	<script src="../../js/mui.min.js"></script>
	<script src="../../js/jquery2.2.4.min.js"></script>
	<script src="../../js/common.js"></script>
	<script src="../../js/vue.min.js"></script>
	<script src="../../js/app.js"></script>
	<script type="text/javascript">
		mui.plusReady(function(){
			bjjdcxList();
		});
	
		
		//办件列表模板
		var vue = new Vue({
		  el: '#scroll',
		  data: {
	  		bjcxList:[{caseNum:'',serviceName:'',applyTime:''}]
		  }
		});		
		
		/**
		 * 加载办件列表信息
		 */
	   function bjjdcxList(){
	   	    var phone = utils.getUrlParam('phone');//从上一个页面获取的手机号码
	   	    var param = 'phone=' + phone;
	     	utils.ajax('appHttpService/getCaseListByPhone.do', function(data) {
			data = JSON.parse(data);			
			var zwfwCaseList = JSON.parse(data.zwfwCaseList);
			console.log(zwfwCaseList);
			if(zwfwCaseList != null){
				var size = zwfwCaseList.length;						
				if(size>0){
					vue.bjcxList = zwfwCaseList;
				}
			  }			
			}, param);
       }	
		
		//查看办件详情
		mui('.mui-content').on('tap', '[caseNum]', function() {
			var caseNum = this.getAttribute('caseNum');
			utils.showWaiting();
			openNewWin('_www/src/work/bjjdcx_info.html?caseNum=' + caseNum);
		});  
		
	</script>
</html>